import React from 'react';
import "./index.less"
import {
    Toast,
    NoticeBar,
    Carousel,
    WingBlank,
    Grid,
    Tabs,
    WhiteSpace,
    ListView,
} from 'antd-mobile';
import TabBarExample from 'components/tabBar'
import TopBarExample from 'components/topBar'
import res from 'antd-mobile-icons/es/DownlandOutline';



export default class Me extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            isLoading: false,
            bgColor:'',
        }
    }

    componentDidMount() {

    }

    goDetail = (res) => {
        this.props.history.push({pathname:'/classify/good/detail', state:{id:123}})
    };

    goOrder = (res) => {
        this.props.history.push({pathname:'/order', state:{id:123}})
    };
	
	goUrl = (res) =>{
		console.log(res)
		this.props.history.push({pathname:"/setting", state:{}})
	}
	
    render() {
        return (
            <div className="me">
                <div className="bg"></div>
                <div className="banner">
                    <div className="user-info">
                        <div className="user-info-top">
                            <img
                                src={require('../../assets/img/home/banner.png')}
                                alt=""
                                style={{ width: '60px', height: '60px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div className="user-info-top-info">
                                <div>
                                    <div>这是名字</div>
                                    <div style={{margin: '2px 0'}}>邀请码：asdsd</div>
                                    <div>用户ID：sd</div>
                                </div>
                                <div>
                                    <img
                                        src={require('../../assets/img/me/vip.png')}
                                        alt=""
                                        style={{ width: '50px', height: '50px',}}
                                        onLoad={() => {
                                            // fire window resize event to change height
                                        }}
                                    />
                                </div>
                            </div>
                        </div>
                        <div className="user-info-bottom">
                            <div className="item"  onClick={this.goUrl}>
                                <img
                                    src={require('../../assets/img/me/top-update.png')}
                                    alt=""
                                    style={{ width: '30px', height: '30px',}}
                                    onLoad={() => {
                                        // fire window resize event to change height
                                    }}
                                />
                                <div>更新资料</div>
                            </div>
                            <div className="item">
                                <img
                                    src={require('../../assets/img/me/top-login.png')}
                                    alt=""
                                    style={{ width: '30px', height: '30px',}}
                                    onLoad={() => {
                                        // fire window resize event to change height
                                    }}
                                />
                                <div>签到</div>
                            </div>
                            <div className="item">
                                <img
                                    src={require('../../assets/img/me/top-code.png')}
                                    alt=""
                                    style={{ width: '30px', height: '30px',}}
                                    onLoad={() => {
                                        // fire window resize event to change height
                                    }}
                                />
                                <div>提货码</div>
                            </div>
                        </div>
                    </div>
                    <div className="vip">
                        <div>您当前的会员级别：<span style={{fontSize: '12px', color: '#4bc989'}}>V1普通会员</span></div>
                        <div className="button">会员中心</div>
                    </div>
                </div>
                <div className="me-order">
                    <div className="title">
                        <div style={{fontWeight: '600'}}>我的订单</div>
                        <div style={{color: '#868686', fontSize: '14px'}}>查看全部</div>
                    </div>
                    <div className="tabs">
                        <div className="tabs-item" onClick={this.goOrder}>
                            <img
                                src={require('../../assets/img/me/order-1.png')}
                                alt=""
                                style={{ width: '30px', height: '30px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div style={{color: '#868686'}}>待付款</div>
                        </div>
                        <div className="tabs-item" onClick={this.goOrder}>
                            <img
                                src={require('../../assets/img/me/order-2.png')}
                                alt=""
                                style={{ width: '30px', height: '30px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div style={{color: '#868686'}}>待配送</div>
                        </div>
                        <div className="tabs-item" onClick={this.goOrder}>
                            <img
                                src={require('../../assets/img/me/order-3.png')}
                                alt=""
                                style={{ width: '30px', height: '30px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div style={{color: '#868686'}}>待提货</div>
                        </div>
                        <div className="tabs-item" onClick={this.goOrder}>
                            <img
                                src={require('../../assets/img/me/order-4.png')}
                                alt=""
                                style={{ width: '30px', height: '30px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div style={{color: '#868686'}}>收货服务</div>
                        </div>
                    </div>
                </div>
                <div className="list">
                    <div className="item">
                        <div className="content">
                            <img
                                src={require('../../assets/img/me/list-1.png')}
                                alt=""
                                style={{ width: '20px', height: '20px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div>优惠卷</div>
                        </div>
                        <div className="icon"></div>
                    </div>
                    <div className="item">
                        <div className="content">
                            <img
                                src={require('../../assets/img/me/list-1.png')}
                                alt=""
                                style={{ width: '20px', height: '20px',}}
                                onLoad={() => {
                                    // fire window resize event to change height
                                }}
                            />
                            <div>优惠卷</div>
                        </div>
                        <div className="icon"></div>
                    </div>
                </div>
                <TabBarExample selectedTab={'me'}></TabBarExample>
            </div>
        );
    }
}

